<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>电视剧详情列表</title>
        <style type="text/css">
            *{
                margin:0;
                padding:0;
            }
            img{
                vertical-align: middle;
            }
            li{
                list-style: none;
                height:30px;
                line-height:30px;
            }
            .clearfix:after{
                clear:both;
                display:table;
                content:"";
            }
            .fl{
                float:left;
            }
            .fr{
                float:right;
            }
            .content{
                width:380px;
                margin:10px auto;
                font-size:12px;
            }
            .box1{
                width:380px;
                border:1px solid #ccc;
                margin-bottom:16px;
            }
            .box1 h3{
                height:27px;
                line-height:27px;
                padding-left:38px;
                background:url("images/1.gif") no-repeat 15px 7px;
                
            }
            .box2{
                margin-bottom:30px;
            }
            img{
                border:1px solid #ccc;
                padding:5px;
                box-sizing:border-box;
                
            }
            .presentation{
                width:240px;
                padding-left:10px;
            }
            .presentation h3{
                height: 50px;
                line-height:50px;
            }
            .presentation p{
                color:#666;
            }
            a{
                text-decoration: none;
                color:#666;
                float:left;
            }
            span{
                float:right;
                color:#666;
            }
            a:hover{
                text-decoration: underline;
            }
            
            
        </style>
    </head>
    <body>
        <div class="content">
            <div class="box1">
                <h3>明星荐片</h3>
            </div>
            <div class="box2 clearfix">
                <div class="fl">
                <img src="images/3.gif"/>
                </div>
                <div class="presentation fl">
                    <h3>周秀娜荐片:让子弹飞</h3>
                    <p>导演：姜文</p>
                    <p>主演：姜文 周润发 葛优</p>
                    <p>点评：我最喜欢的要算《让子弹飞》了,超喜欢...[详情]</p>
                </div>
            </div>
            <ul class="clearfix">
                <li><a href="#">《巴别塔》：好的故事引人深思</a><span>阿朵</span></li>
                <li><a href="#">《洛杉矶之战》：外星人那么弱智？</a><span>丁子俊</span></li> 
                <li><a href="#">《让子弹飞》：武侠里也可以有爱情</a><span>周秀娜</span></li>
                <li><a href="#">《剑雨》：好的故事引人深思</a><span>叶年生</span></li>
                <li><a href="#">《春风沉醉的夜晚》：非常真实</a><span>如小果</span></li>
                <li><a href="#">《克洛伊》：故事简单却细致</a><span>刘若英</span></li>
            </ul>
        </div>
    </body>
</html>
















